<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ include file="index.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<!-- <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="favicon.ico" >
    <link rel="Shortcut Icon" href="favicon.ico" /> -->

<!-- <title>主页</title>
    <meta name="keywords" content="耶回收">
    <meta name="description" content="耶回收"> -->

<link href="<%=basePath%>lib/webuploader/0.1.5/webuploader.css"
	rel="stylesheet" type="text/css" />
</head>
<style type="text/css">
.h_css {
	width: 100%;
	height: 40px;
	background: #f6f6f6;
	font-size: 18px;
	line-height: 40px;
	margin-top: 20px;
}

.file_css {
	width: 145px;
	height: 29px;
	border: 1px solid #ddd;
	color: #cf3131;
}
 body .demo-class .layui-layer-title{background:#3867a5;color:#fff;}
 body .demo-class .layui-layer-btn0{background:#3867a5;}
</style>
<body>

	<!--_表格--开始-->
	<section class="Hui-article-box" style="overflow: auto"> <nav
		class="breadcrumb">
	<i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>
	商品管理 <span class="c-gray en">&gt;</span>商品品牌管理<span class="c-gray en">&gt;</span>
	添加分类 </nav> <!--     checkBackitemExsit() -->
	<div class="page-container">
		
	<!-- 	<div class="h_css">商品分类的添加<i class="Hui-iconfont">&#xe716;</i></div>
	      <div class="form form-horizontal">
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2"><span
					class="c-red">*</span>商品类别名称</label>
				<div class="formControls col-xs-8 col-sm-4">
					<input type="text" class="input-text" value="" placeholder="请输入商品的类别名称"
						id="c_classify">
				</div>
			</div>
			<div class="row cl">
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
					<button class="btn btn-primary radius" id="c_btn" >
						<i class="Hui-iconfont">&#xe632;</i> 添加类别
					</button>
				</div>
			</div>
		</div> -->
<!----------------------------------------添加品牌--------------------------------------------------------->
		<div class="h_css">商品品牌的添加<i class="Hui-iconfont">&#xe716;</i>
		<button class="" onclick="viewBrand('品牌信息')"  title="查看品牌"><i class="Hui-iconfont">&#xe61d;</i>查看品牌信息</button></div>
		  <div class="form form-horizontal">
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2"><span
					class="c-red">*</span>商品分类：</label>
				<div class="formControls col-xs-8 col-sm-4">
					<!--<span class="select-box">  -->
					<select class="input-text" name="cid" id="b_classify">
						<c:forEach items="${ classifylist}" var="classify">
							<option value="${classify.cid }">${classify.classifyname}</option>
						</c:forEach>
					</select>
					<!-- </span> -->
				</div>
			</div>
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2">
				<span class="c-red">*</span>品牌名称：</label>
				<div class="formControls col-xs-8 col-sm-4">
                    <input type="text" class="input-text" value="" placeholder="请输入品牌名称"
						id="b_brand">
				</div>
			</div>
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2">
				<span class="c-red">*</span> 上传品牌图片：</label>
				<div class="formControls col-xs-8 col-sm-4">
				<input id="brandfile" type="file" class="file_css" name="file"/>
			    </div>
			</div>
			<div class="row cl">
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
					<button class="btn btn-primary radius" id="b_btn">
						<i class="Hui-iconfont">&#xe632;</i> 添加品牌
					</button>
				</div>
			</div>
			</div>
<!---------------------------------------------添加型号------------------------------------------------------->
			<div class="h_css">商品型号添加<i class="Hui-iconfont">&#xe716;</i></div>
			<div class="form form-horizontal">
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2"><span
					class="c-red">*</span>商品分类：</label>
				<div class="formControls col-xs-8 col-sm-4">
					<!--<span class="select-box">  -->
					<select class="input-text" name="cid" id="m_classify"
						onchange="getbrandByid()">
						<c:forEach items="${ classifylist}" var="classify">
							<option value="${classify.cid }">${classify.classifyname}</option>
						</c:forEach>
					</select>
					<!-- </span> -->
				</div>
			</div>
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2"><span
					class="c-red">*</span>品牌名称：</label>
				<div class="formControls col-xs-8 col-sm-4">
                   <select class="input-text" id="m_brand">
						<c:forEach items="${ brandlist}" var="brand">
							<option value="${brand.pid }">${brand.brandname}</option>
						</c:forEach>
					</select>
				</div>
			</div>
			<div class="row cl">
				<label class="form-label col-xs-4 col-sm-2"><span
					class="c-red">*</span>型号名称：</label>
				<div class="formControls col-xs-8 col-sm-4">
                    <input type="text" class="input-text" value="" placeholder="请输入型号名称"
						id="m_model" name="model">
				</div>
			</div>
			<div class="row cl">
				<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
					<button class="btn btn-primary radius" id="m_btn">
						<i class="Hui-iconfont">&#xe632;</i> 添加型号
					</button>
				</div>
			</div>
			</div>
			
			
		
	</div>
	</section>



	<!--/_footer /作为公共模版分离出去-->

	<!--请在下方写此页面业务相关的脚本-->
	<script type="text/javascript"
		src="lib/webuploader/0.1.5/webuploader.min.js"></script>
	<script type="text/javascript">
	
	 //浏览品牌
	function viewBrand(title){
		 var cid =$("#b_classify").val();
		 var index = layer.open({
	            type: 2,
	            skin:'demo-class',
	            anim:1,
	            shadeClose: true,
	            title: title,
	            area: [650+'px', 400 +'px'],
	            shade:0.3,
	            content:"viewbrand?cid="+cid
		  
		 });
		 
		 
	 }
	
	//获取品牌
		function getbrandByid() {
			var cid = $("#m_classify").val();
			$.ajax({
				type : 'POST',
				url : 'getbrandByid',
				data : {
					"cid" : cid
				},
				dataType : 'json',
				success : function(data) {
					var b = data.brands;
					$("#m_brand").empty();
					//$("#modelselect").append("<option value="">请选择品牌</option>");
					for (var i = 0; i < b.length; i++) {
						$("#m_brand").append(
								"<option value="+b[i].pid+">" + b[i].brandname
										+ "</option>");
					}
					
				},
				error : function(data) {
					console.log(data.msg);
				},
			});

		}
	//添加类别的ajax
	$(function(){
		$("#c_btn").click(function(){
		  var classifyname = $("#c_classify").val();
		  if(classifyname==null||classifyname==""){
			  layer.msg("分类名称不能为空！",{icon: 2,time:1000});
			  
			 return false;
		  }else{
			  console.log("---进入检测类别是否存在的ajax--")
		  $.ajax({
				type :"POST",
				url : "checkClassifyname",
				data : {
					"classifyname" : classifyname
				},
				dataType : "json",
				success : function(data) {
					//判断数据库是否存在该分类若存在则不允许添加
					if(data.flag==false){
						layer.msg("请不要重复添加已有分类！",{icon: 2,time:2000});
					}else{
					$.ajax({
							type : "POST",
							url : "addOneClassify",
							data : {
								"classifyname" : classifyname
							},
							dataType :"json",
							success : function(data) {
								var b = data.classifys;
								$("#b_classify").empty();
								//$("#modelselect").append("<option value="">请选择品牌</option>");
								for (var i = 0; i < b.length; i++) {
									$("#b_classify").append(
											"<option value="+b[i].cid+">" + b[i].classifyname
													+ "</option>");
									
								}
									$("#m_classify").empty();
									//$("#modelselect").append("<option value="">请选择品牌</option>");
									for (var i = 0; i < b.length; i++) {
										$("#m_classify").append(
												"<option value="+b[i].cid+">" + b[i].classifyname
														+ "</option>");	
									
									}
								
								layer.msg("添加成功",{icon: 1,time:2000});
							},
							error : function(data) {
								layer.msg("ajax通讯异常");
							},
						});	
				}	 
				},
				error : function(data) {
					layer.msg("---ajax通讯异常");
				}
				
				});
		  }
		});
		
	});
	
	//添加品牌的ajax
$(function(){
		$("#b_btn").click(function(){
			var animateimg =$("#brandfile").val();
			var imgarr=animateimg.split('\\'); //分割 
		    var myimg=imgarr[imgarr.length-1]; //去掉 // 获取图片名 
		    var houzui = myimg.lastIndexOf('.'); //获取 . 出现的位置
		    var ext = myimg.substring(houzui, myimg.length).toUpperCase();  //切割 . 获取文件后缀 
		    var file = $("#brandfile").get(0).files[0]; //获取上传的文件
		    if(file==null){
		    	layer.msg("您未选择图片");
		    	return;	
		    }
		    var cid =$("#b_classify").val();
			var brandname = $("#b_brand").val();
		  if(brandname==null||brandname==""){
			  layer.msg("品牌名称不能为空！",{icon: 2,time:2000});
			 return;
			 }
		  if(cid==null||cid==""){
			  layer.msg("请选择一个分类");
			  return;
			  }
		   var form = new FormData();
		   form.append("brandname",brandname);
		   form.append("cid",cid);
		    form.append("ext", ext);
		    form.append("file", file);
		    if(ext !=".PNG"&& ext !=".GIF"&&ext !=".JPG"&&ext !=".JPEG"&&ext !=".BMP"){
				layer.msg("请选择正确的图片类型");
				 return;
			 }else{
				  $.ajax({
						type :"POST",
						url : "checkBrandname",
						data : {
							"brandname" : brandname,
							"cid":cid
						},
						dataType : "json",
						success : function(data) {
							//判断数据库是否存在该品牌若存在则不允许添加
							if(data.flag==false){
								layer.msg("请不要重复添加已有品牌！",{icon: 2,time:2000});
							}else{
							$.ajax({
									type : "POST",
									url : "addOneBrand",
									data :form,
									processData: false,
									contentType: false,
									dataType :"json",
									success : function(data) {
										layer.msg("添加成功",{icon: 1,time:2000});
										location.reload();
									},
									error : function(data) {
										layer.msg("ajax通讯异常");
									},
								});	
						}	 
						},
						error : function(data) {
							layer.msg("---ajax通讯异常");
						}
						
						});
				  
				  }
				}); 
	          })

	
	//添加型号
	$(function(){
		$("#m_btn").click(function(){
		   var model =$("#m_model").val();
			var pid = $("#m_brand").val();
		  if(model==null||model==""){
			  layer.msg("型号名称不能为空！",{icon: 2,time:1000});
			  
			 return false;
		  }else{
		  $.ajax({
				type :"POST",
				url : "checkModelname",
				data : {
					"model" : model,
					"pid":pid
				},
				dataType : "json",
				success : function(data) {
					//判断数据库是否存在该品牌若存在则不允许添加
					if(data.flag==false){
						layer.msg("请不要重复添加已有型号！",{icon: 2,time:2000});
					}else{
					$.ajax({
							type : "POST",
							url : "addOneModel",
							data : {
								"pid" : pid,
								"model":model
								
							},
							dataType :"json",
							success : function(data) {
								layer.msg("添加成功",{icon: 1,time:2000});
							},
							error : function(data) {
								layer.msg("ajax通讯异常");
							},
						});	
				}	 
				},
				error : function(data) {
					layer.msg("---ajax通讯异常");
				}
				
				});
		  
		  }
		});
		
	});

	</script>
</body>
</html>